<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>JSDoc: Class: OrbitControls</title>

    <script src="scripts/prettify/prettify.js"> </script>
    <script src="scripts/prettify/lang-css.js"> </script>
    <!--[if lt IE 9]>
      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
    <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
</head>

<body>

<div id="main">

    <h1 class="page-title">Class: OrbitControls</h1>

    




<section>

<header>
    
        <h2><span class="attribs"><span class="type-signature"></span></span>
            <span class="ancestors"><a href="global.html#ROS3D">ROS3D</a>.</span>OrbitControls<span class="signature">(scene, camera, userZoomSpeed, userRotateSpeed, autoRotate, autoRotateSpeed, displayPanAndZoomFrame, lineTypePanAndZoomFrame)</span><span class="type-signature"></span></h2>
        
    
</header>

<article>
    <div class="container-overview">
    
        

    

    
    <h4 class="name" id="OrbitControls"><span class="type-signature"></span>new OrbitControls<span class="signature">(scene, camera, userZoomSpeed, userRotateSpeed, autoRotate, autoRotateSpeed, displayPanAndZoomFrame, lineTypePanAndZoomFrame)</span><span class="type-signature"></span></h4>
    

    



<div class="description">
    <p>Behaves like THREE.OrbitControls, but uses right-handed coordinates and z as up vector.</p>
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>scene</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>the global scene to use</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>camera</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>the camera to use</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>userZoomSpeed</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>(optional) - the speed for zooming</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>userRotateSpeed</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>(optional) - the speed for rotating</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>autoRotate</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>(optional) - if the orbit should auto rotate</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>autoRotateSpeed</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>(optional) - the speed for auto rotating</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>displayPanAndZoomFrame</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>whether to display a frame when panning/zooming
(defaults to true)</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>lineTypePanAndZoomFrame</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>line type for the frame that is displayed when
panning/zooming. Only has effect when
displayPanAndZoomFrame is set to true.</p></td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="visualization_interaction_OrbitControls.js.html">visualization/interaction/OrbitControls.js</a>, <a href="visualization_interaction_OrbitControls.js.html#line24">line 24</a>
    </li></ul></dd>
    

    

    

    
</dl>




















    
    </div>

    

    

    

    

    

    

    

    
        <h3 class="subsection-title">Methods</h3>

        
            

    

    
    <h4 class="name" id="rotateDown"><span class="type-signature"></span>rotateDown<span class="signature">(angle)</span><span class="type-signature"></span></h4>
    

    



<div class="description">
    <p>Rotate the camera down by the given angle.</p>
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>angle</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>(optional) - the angle to rotate by</p></td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="visualization_interaction_OrbitControls.js.html">visualization/interaction/OrbitControls.js</a>, <a href="visualization_interaction_OrbitControls.js.html#line431">line 431</a>
    </li></ul></dd>
    

    

    

    
</dl>




















        
            

    

    
    <h4 class="name" id="rotateLeft"><span class="type-signature"></span>rotateLeft<span class="signature">(angle)</span><span class="type-signature"></span></h4>
    

    



<div class="description">
    <p>Rotate the camera to the left by the given angle.</p>
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>angle</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>(optional) - the angle to rotate by</p></td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="visualization_interaction_OrbitControls.js.html">visualization/interaction/OrbitControls.js</a>, <a href="visualization_interaction_OrbitControls.js.html#line395">line 395</a>
    </li></ul></dd>
    

    

    

    
</dl>




















        
            

    

    
    <h4 class="name" id="rotateRight"><span class="type-signature"></span>rotateRight<span class="signature">(angle)</span><span class="type-signature"></span></h4>
    

    



<div class="description">
    <p>Rotate the camera to the right by the given angle.</p>
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>angle</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>(optional) - the angle to rotate by</p></td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="visualization_interaction_OrbitControls.js.html">visualization/interaction/OrbitControls.js</a>, <a href="visualization_interaction_OrbitControls.js.html#line407">line 407</a>
    </li></ul></dd>
    

    

    

    
</dl>




















        
            

    

    
    <h4 class="name" id="rotateUp"><span class="type-signature"></span>rotateUp<span class="signature">(angle)</span><span class="type-signature"></span></h4>
    

    



<div class="description">
    <p>Rotate the camera up by the given angle.</p>
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>angle</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>(optional) - the angle to rotate by</p></td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="visualization_interaction_OrbitControls.js.html">visualization/interaction/OrbitControls.js</a>, <a href="visualization_interaction_OrbitControls.js.html#line419">line 419</a>
    </li></ul></dd>
    

    

    

    
</dl>




















        
            

    

    
    <h4 class="name" id="showAxes"><span class="type-signature"></span>showAxes<span class="signature">()</span><span class="type-signature"></span></h4>
    

    



<div class="description">
    <p>Display the main axes for 1 second.</p>
</div>













<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="visualization_interaction_OrbitControls.js.html">visualization/interaction/OrbitControls.js</a>, <a href="visualization_interaction_OrbitControls.js.html#line373">line 373</a>
    </li></ul></dd>
    

    

    

    
</dl>




















        
            

    

    
    <h4 class="name" id="update"><span class="type-signature"></span>update<span class="signature">()</span><span class="type-signature"></span></h4>
    

    



<div class="description">
    <p>Update the camera to the current settings.</p>
</div>













<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="visualization_interaction_OrbitControls.js.html">visualization/interaction/OrbitControls.js</a>, <a href="visualization_interaction_OrbitControls.js.html#line465">line 465</a>
    </li></ul></dd>
    

    

    

    
</dl>




















        
            

    

    
    <h4 class="name" id="zoomIn"><span class="type-signature"></span>zoomIn<span class="signature">(zoomScale)</span><span class="type-signature"></span></h4>
    

    



<div class="description">
    <p>Zoom in by the given scale.</p>
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>zoomScale</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>(optional) - the scale to zoom in by</p></td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="visualization_interaction_OrbitControls.js.html">visualization/interaction/OrbitControls.js</a>, <a href="visualization_interaction_OrbitControls.js.html#line443">line 443</a>
    </li></ul></dd>
    

    

    

    
</dl>




















        
            

    

    
    <h4 class="name" id="zoomOut"><span class="type-signature"></span>zoomOut<span class="signature">(zoomScale)</span><span class="type-signature"></span></h4>
    

    



<div class="description">
    <p>Zoom out by the given scale.</p>
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>zoomScale</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>(optional) - the scale to zoom in by</p></td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="visualization_interaction_OrbitControls.js.html">visualization/interaction/OrbitControls.js</a>, <a href="visualization_interaction_OrbitControls.js.html#line455">line 455</a>
    </li></ul></dd>
    

    

    

    
</dl>




















        
            

    

    
    <h4 class="name" id="~intersectViewPlane"><span class="type-signature">(inner) </span>intersectViewPlane<span class="signature">(mouseRay, planeOrigin, planeNormal)</span><span class="type-signature"></span></h4>
    

    



<div class="description">
    <p>Used to track the movement during camera movement.</p>
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>mouseRay</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>the mouse ray to intersect with</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>planeOrigin</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>the origin of the plane</p></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>planeNormal</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>the normal of the plane</p></td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="visualization_interaction_OrbitControls.js.html">visualization/interaction/OrbitControls.js</a>, <a href="visualization_interaction_OrbitControls.js.html#line178">line 178</a>
    </li></ul></dd>
    

    

    

    
</dl>















<h5>Returns:</h5>

        
<div class="param-desc">
    <p>the intersection</p>
</div>



    





        
            

    

    
    <h4 class="name" id="~onMouseDown"><span class="type-signature">(inner) </span>onMouseDown<span class="signature">(event3D)</span><span class="type-signature"></span></h4>
    

    



<div class="description">
    <p>Handle the mousedown 3D event.</p>
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>event3D</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>the 3D event to handle</p></td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="visualization_interaction_OrbitControls.js.html">visualization/interaction/OrbitControls.js</a>, <a href="visualization_interaction_OrbitControls.js.html#line91">line 91</a>
    </li></ul></dd>
    

    

    

    
</dl>




















        
            

    

    
    <h4 class="name" id="~onMouseMove"><span class="type-signature">(inner) </span>onMouseMove<span class="signature">(event3D)</span><span class="type-signature"></span></h4>
    

    



<div class="description">
    <p>Handle the mousemove 3D event.</p>
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>event3D</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>the 3D event to handle</p></td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="visualization_interaction_OrbitControls.js.html">visualization/interaction/OrbitControls.js</a>, <a href="visualization_interaction_OrbitControls.js.html#line127">line 127</a>
    </li></ul></dd>
    

    

    

    
</dl>




















        
            

    

    
    <h4 class="name" id="~onMouseUp"><span class="type-signature">(inner) </span>onMouseUp<span class="signature">(event3D)</span><span class="type-signature"></span></h4>
    

    



<div class="description">
    <p>Handle the mouseup 3D event.</p>
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>event3D</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>the 3D event to handle</p></td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="visualization_interaction_OrbitControls.js.html">visualization/interaction/OrbitControls.js</a>, <a href="visualization_interaction_OrbitControls.js.html#line203">line 203</a>
    </li></ul></dd>
    

    

    

    
</dl>




















        
            

    

    
    <h4 class="name" id="~onMouseWheel"><span class="type-signature">(inner) </span>onMouseWheel<span class="signature">(event3D)</span><span class="type-signature"></span></h4>
    

    



<div class="description">
    <p>Handle the mousewheel 3D event.</p>
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>event3D</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>the 3D event to handle</p></td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="visualization_interaction_OrbitControls.js.html">visualization/interaction/OrbitControls.js</a>, <a href="visualization_interaction_OrbitControls.js.html#line216">line 216</a>
    </li></ul></dd>
    

    

    

    
</dl>




















        
            

    

    
    <h4 class="name" id="~onTouchDown"><span class="type-signature">(inner) </span>onTouchDown<span class="signature">(event3D)</span><span class="type-signature"></span></h4>
    

    



<div class="description">
    <p>Handle the touchdown 3D event.</p>
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>event3D</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>the 3D event to handle</p></td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="visualization_interaction_OrbitControls.js.html">visualization/interaction/OrbitControls.js</a>, <a href="visualization_interaction_OrbitControls.js.html#line243">line 243</a>
    </li></ul></dd>
    

    

    

    
</dl>




















        
            

    

    
    <h4 class="name" id="~onTouchMove"><span class="type-signature">(inner) </span>onTouchMove<span class="signature">(event3D)</span><span class="type-signature"></span></h4>
    

    



<div class="description">
    <p>Handle the touchmove 3D event.</p>
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>event3D</code></td>
            

            <td class="type">
            
            </td>

            

            

            <td class="description last"><p>the 3D event to handle</p></td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="visualization_interaction_OrbitControls.js.html">visualization/interaction/OrbitControls.js</a>, <a href="visualization_interaction_OrbitControls.js.html#line281">line 281</a>
    </li></ul></dd>
    

    

    

    
</dl>




















        
    

    

    
</article>

</section>




</div>

<nav>
    <h2><a href="index.html">Home</a></h2><h3>Classes</h3><ul><li><a href="ROS3D.Arrow.html">Arrow</a></li><li><a href="ROS3D.Arrow2.html">Arrow2</a></li><li><a href="ROS3D.Axes.html">Axes</a></li><li><a href="ROS3D.DepthCloud.html">DepthCloud</a></li><li><a href="ROS3D.Grid.html">Grid</a></li><li><a href="ROS3D.Highlighter.html">Highlighter</a></li><li><a href="ROS3D.InteractiveMarker.html">InteractiveMarker</a></li><li><a href="ROS3D.InteractiveMarkerClient.html">InteractiveMarkerClient</a></li><li><a href="ROS3D.InteractiveMarkerControl.html">InteractiveMarkerControl</a></li><li><a href="ROS3D.InteractiveMarkerHandle.html">InteractiveMarkerHandle</a></li><li><a href="ROS3D.InteractiveMarkerMenu.html">InteractiveMarkerMenu</a></li><li><a href="ROS3D.LaserScan.html">LaserScan</a></li><li><a href="ROS3D.Marker.html">Marker</a></li><li><a href="ROS3D.MarkerArrayClient.html">MarkerArrayClient</a></li><li><a href="ROS3D.MarkerClient.html">MarkerClient</a></li><li><a href="ROS3D.MeshResource.html">MeshResource</a></li><li><a href="ROS3D.MouseHandler.html">MouseHandler</a></li><li><a href="ROS3D.NavSatFix.html">NavSatFix</a></li><li><a href="ROS3D.OccupancyGrid.html">OccupancyGrid</a></li><li><a href="ROS3D.OccupancyGridClient.html">OccupancyGridClient</a></li><li><a href="ROS3D.Odometry.html">Odometry</a></li><li><a href="ROS3D.OrbitControls.html">OrbitControls</a></li><li><a href="ROS3D.Path.html">Path</a></li><li><a href="ROS3D.Point.html">Point</a></li><li><a href="ROS3D.PointCloud2.html">PointCloud2</a></li><li><a href="ROS3D.Points.html">Points</a></li><li><a href="ROS3D.Polygon.html">Polygon</a></li><li><a href="ROS3D.Pose.html">Pose</a></li><li><a href="ROS3D.PoseArray.html">PoseArray</a></li><li><a href="ROS3D.PoseWithCovariance.html">PoseWithCovariance</a></li><li><a href="ROS3D.SceneNode.html">SceneNode</a></li><li><a href="ROS3D.TriangleList.html">TriangleList</a></li><li><a href="ROS3D.Urdf.html">Urdf</a></li><li><a href="ROS3D.UrdfClient.html">UrdfClient</a></li><li><a href="ROS3D.Viewer.html">Viewer</a></li></ul><h3>Global</h3><ul><li><a href="global.html#decode64">decode64</a></li><li><a href="global.html#ROS3D">ROS3D</a></li></ul>
</nav>

<br class="clear">

<footer>
    Documentation generated by <a href="https://github.com/jsdoc/jsdoc">JSDoc 3.6.3</a> on Tue Sep 03 2019 09:30:06 GMT+0900 (Korean Standard Time)
</footer>

<script> prettyPrint(); </script>
<script src="scripts/linenumber.js"> </script>
</body>
</html>